import { useLocation } from "react-router-dom";
import ReportsBarChart from "../../../examples/Charts/BarCharts/ReportsBarChart";
import DashboardLayout from "../../../examples/LayoutContainers/DashboardLayout";
import DashboardNavbar from "../../../examples/Navbars/DashboardNavbar";
import MDBox from "../../../components/MDBox";

function Parity() {
  const location = useLocation();
  const { product = [] } = location.state || {};

  return (
    <DashboardLayout>
      <DashboardNavbar />
      <MDBox py={3}>
        <ReportsBarChart
          color="primary" // 自定义颜色
          title="价格比较图"
          description="看看哪个最便宜"
          date="更新于今日"
          chart={{
            labels: product.map((item) => item.name),
            datasets: {
              label: "价格",
              data: product.map((item) => item.price),
            },
            products: product,
          }}
        />
      </MDBox>
    </DashboardLayout>
  );
}

export default Parity;
